<template>
  <div class="overall-page page">
    <div class="overall-container">
      <div class="top-container">
        <div class="top-item">
          <el-row style="width: 100%;" class="mb21 cusHeight">
            <Card title="全市各县市区结对关爱工作开展情况" :is-export="true" page="420">
              <BarCharts :source="barList1" :legend="true" :loading="false" :barWidth="15" :barRadius="[0,0,0,0]"
                         :grid="{top: 40, bottom: -10, left: 20, right: 10}"/>
            </Card>
          </el-row>
          <el-row style="width: 100%;" class="mb2 cusHeight">
            <Card title="基础教育学生数" :is-export="true" page="434">
              <BarCharts :source="barList3" :legend="true" :loading="false" :smooth="true" :area="true"
                          :areaGradient="true"
                         :barWidth="15" :barRadius="[0,0,0,0]"
                          :grid="{top: 40, bottom: -10, left: 20, right: 10}"/>
            </Card>
          </el-row>
        </div>
        <div class="top-item1">
          <div id="societyMap" class="chart"></div>
          <div class="map-tooltip" v-if="tooltipShow">
            <div class="map-tooltip-title">{{ cityName }}</div>
            <div style="position: absolute;right: 0;top:10px;width: 30px;height: 30px" @click="tooltipShow"></div>
            <div class="map-tooltip-content">
              <div class="tooltip-item" v-for="(item,index) in toolList" :key="index">
                <div class="value">
                  <span class="number">{{item.value}}</span>
                  <span class="unit">{{item.unit}}</span>
                </div>
                <div class="label">{{item.name}}</div>
              </div>
            </div>
          </div>
        </div>
        <div class="top-item">
          <el-row style="width: 100%;" class="mb21 cusHeight">
            <Card title="教育工作情况" :is-export="true" page="426">
              <BarCharts :source="barList2" :legend="true" :loading="false" :barWidth="15" :barRadius="[0,0,0,0]"
                          :grid="{top: 40, bottom: -10, left: 20, right: 10}"
              />

            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="医疗卫生机构情况" :is-export="true" page="439">
              <BarCharts :source="barList4" :legend="true" :loading="false" :barWidth="15" :barRadius="[0,0,0,0]"
                         :grid="{top: 40, bottom: -10, left: 20, right: 10}"/>
            </Card>
          </el-row>
        </div>
      </div>
      <div class="info-block">
        <div class="info-container">
          <el-row class="info-item cusHeight">
            <Card title="2023-2024 学年度“四率”情况" :is-export="true" page="435">
              <el-row :gutter="10" style="width: 100%;height:50%;padding: 10px 0">
                <el-col style="height: 100%" :span="4">
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="101.16%" text="小学升学率"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="0.00%" text="中学辍学率"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="4">
                </el-col>
              </el-row>
              <el-row :gutter="10" style="width: 100%;height:50%;padding: 10px 0">
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="100.00%" text="初中毕业率"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="99.74%" text="2022年义务教育巩固率"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="99.77%" text="2023年义务教育巩固率"></CategoryProportion>
                </el-col>
              </el-row>
            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="中小学教学设施情况" :is-export="true" page="436">
              <TableComponent :headers="headers1" :data="tableData1"/>
            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="“结对帮扶爱心肃州”行动工作开展情况" :is-export="true" page="421">
              <el-row :gutter="10" style="width: 100%;height:50%;padding: 10px 0">
                <el-col style="height: 100%" :span="4">
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="6.51个" text="关爱对象所属街道/乡镇"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="6.24人" text="结对干部"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="4">
                </el-col>
              </el-row>
              <el-row :gutter="10" style="width: 100%;height:50%;padding: 10px 0">
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="42700人" text="关爱对象"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="23281件" text="解决问题"></CategoryProportion>
                </el-col>
                <el-col style="height: 100%" :span="8">
                  <CategoryProportion number="1101元" text="资助资金"></CategoryProportion>
                </el-col>
              </el-row>
            </Card>
          </el-row>

        </div>
        <div class="info-container">
          <el-row class="info-item cusHeight">
            <Card title="医疗卫生人员情况" :is-export="true" page="441">
              <BarCharts :source="barList5" :legend="true" :loading="false" :barWidth="15" :barRadius="[0,0,0,0]"
                         :grid="{top: 40, bottom: -10, left: 20, right: 10}"/>
            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="医保工作情况" :is-export="true" page="442">
              <TableComponent :headers="headers2" :data="tableData2"/>
            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="疾控工作情况" :is-export="true" page="444">
              <TableComponent :headers="headers3" :data="tableData3"/>
            </Card>
          </el-row>
        </div>
        <div class="info-container">
          <el-row class="info-item cusHeight">
            <Card title="科技领域" :is-export="true" page="450">
              <BarCharts :source="barList6" :legend="true" :loading="false"
                          :grid="{top: 40, bottom: -10, left: 20, right: 10}" :barWidth="15" :barRadius="[0,0,0,0]"/>
            </Card>
          </el-row>
          <el-row class="info-item cusHeight">
            <Card title="快递行业法人企业、驻酒分支机构情况" :is-export="true" page="451">
              <BarCharts :source="barList7" :legend="true" :loading="false"
                          :grid="{top: 40, bottom: -10, left: 20, right: 10}" :barWidth="15" :barRadius="[0,0,0,0]"/>
            </Card>
          </el-row>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import Card from "@/components/Card/Card.vue";
import BarCharts from "@/components/Charts/Bar.vue";
import CategoryProportion from "@/components/CategoryProportion.vue";
import TableComponent from "@/components/TableComponent.vue";
import LineCharts from "@/components/Charts/Line.vue";
import {staticImageToBase64} from "@/utils/utils";
import geoJson from "@/assets/geo/suzhouqu.json";

export default {
  components: {LineCharts, TableComponent, CategoryProportion, BarCharts, Card},
  data() {
    return {
      cityName:'',
      tooltipShow: false,
      toolList:[],
      charts: {
        societyMap: null
      },
      barList1: {
        xData: ['酒泉市', '肃州区', '瓜州县', '玉门市', '敦煌市', '金塔县', '肃北蒙古族自治县', '阿克塞哈萨克族自治县'],
        yData: {
          '关爱对象人数': [
            7795,
            2303,
            1498,
            1249,
            1270,
            1329,
            88,
            58
          ],
          '结对干部': [7335, 2206, 1461, 1195, 1138, 1198, 88, 49],
        },
        yLabel: '单位：人'
      },
      barList2: {
        xData: [
          "中小学合计",
          "高中",
          "一贯制学校",
          "初中",
          "小学"
        ],
        yData: {
          '城市': [
            33,
            6,
            9,
            6,
            12
          ],
          '农村': [
            16,
            0,
            1,
            0,
            15
          ],
        },
        yLabel: '单位：人'
      },
      barList3: {
        xData: ['毕业生数', '招生数', '在校生数'],
        yData: {
          '总计': [17322, 16258, 65661]
        },
        yLabel: '单位：人'
      },
      barList4: {
        xData: [
          "东北街街道", "东南街街道", "西南街街道", "西北街街道",
          "西峰镇", "果园镇", "银达镇", "泉湖镇", "铧尖镇",
          "三墩镇", "黄泥堡乡", "西洞镇", "总寨镇",
          "上坝镇", "东洞镇", "金佛寺镇", "丰乐镇",
          "清水镇", "下河清镇"
        ],
        yData: {
          '全区卫生机构': [
            53, 55, 67, 23, 23, 10, 20, 13, 7,
            18, 2, 6, 13, 15, 9, 16, 6, 18, 8
          ]
        },
        yLabel: '单位：个'
      },
      barList5: {
        xData: [
          "东北街街道",
          "东南街街道",
          "西南街街道",
          "西北街街道",
          "西峰镇",
          "果园镇",
          "银达镇",
          "泉湖镇",
          "铧尖镇",
          "三墩镇",
          "黄泥堡乡",
          "西洞镇",
          "总寨镇",
          "上坝镇",
          "东洞镇",
          "金佛寺镇",
          "丰乐镇",
          "清水镇",
          "下河清镇"
        ],
        yData: {
          '卫生技术人员': [
            1000, 285, 566, 342, 107, 35, 73, 47, 29, 69,
            10, 26, 52, 48, 33, 64, 25, 70, 68
          ]
        },
        yLabel: '单位：人'
      },
      barList6: {
        xData: [
          "国家级工程技术研究中心",
          "省级工程技术研究中心",
          "省级重点实验室",
          "省级新型研发机构",
          "省级科技企业孵化器",
          "省级国际科技合作基地",
          "省级创新型县市",
          "省级高新技术产业开发区",
          "国家级众创空间",
          "省级众创空间",
          "省级科普基地",
          "高新技术企业",
          "省级科技创新型企业",
          "科技型中小企业",
          "全国科普示范县（区）",
          "科技馆"
        ],
        yData: {
          '肃州区': [1, 7, 3, 4, 1, 2, 0, 0, 1, 4, 3, 84, 40, 125, 1, 1]
        },
        yLabel: '单位：个'
      },
      barList7: {
        xData: ['肃州区', '金塔县', '玉门市', '瓜州县', '敦煌市', '肃北县', '阿克塞县'],
        yData: {
          '驻酒分支机构': [3, 0, 0, 0, 0, 0, 0],
          '法人企业': [6, 2, 2, 5, 4, 0, 0],
        },
        yLabel: '单位：个'
      },
      headers1: [
        "序号",
        "单位名称",
        "占地面积（平方米）",
        "校舍面积（平方米）",
        "教辅用房（平方米）",
        "行政用房（平方米）",
        "生活用房（平方米）",
        "宿舍（平方米）",
        "厕所（平方米）",
        "餐厅（平方米）",
        "其他（平方米）",
        "运动场地（平方米）",
        "数字终端（套）",
        "教师用机（台）",
        "学生用机（台）",
        "图书（本）",
        "教学仪器设备总值（万元）",
        "多媒体教室数（间）"
      ],
      tableData1: [
        ["1", "酒泉市清水中心小学", "20923.6", "4089", "1575", "753.3", "4818.6", "21.67", "30.10", "485", "848.59", "1136", "25", "22", "47", "7800", "85.8", "17", "9"],
        ["2", "玉门油田小学", "20289", "5598.5", "1047.62", "1084.2", "1234.5", "0", "57.5", "0", "0", "1282.58", "34.1", "112", "382", "9300", "62.7", "37", "7"],
        ["3", "酒泉市东洞中心小学", "22497", "6717", "817", "220", "3000", "159", "300", "300", "1350", "1325", "85", "40", "45", "9500", "114.4", "20", "17"],
        ["4", "酒泉市东关街中心小学", "3170", "1046", "513", "540", "476", "0", "367", "565", "380", "40", "75", "30", "45", "6000", "98.5", "20", "20"],
        ["5", "酒泉市南苑小学", "12204.5", "3123.3", "878.5", "87.7", "712.8", "0", "71.8", "0", "419.36", "653.8", "129", "41", "81", "10000", "198.3", "22", "22"],
        ["6", "酒泉市果园镇中心小学", "20000", "3907", "2884.2", "860", "2200", "442", "603", "386.7", "2000", "50", "63", "27", "25", "5600", "82.4", "16", "11"],
        ["7", "酒泉市春光小学", "21271.6", "4609.4", "1028.39", "18.4", "602.6", "0", "96.6", "0", "678.6", "2955", "27", "12", "25", "5600", "82.4", "7", "4"],
        ["8", "酒泉市东关街第二小学", "23000", "3459", "3957", "294.1", "604.6", "0", "236", "0", "0", "2320", "21.6", "62", "134", "27004", "208.8", "23", "22"],
        ["9", "酒泉市东关街第一小学", "7006", "3202", "259", "235", "0", "206", "0", "0", "3238", "106", "30", "135", "2726", "1044", "24", "24", "21"],
        ["10", "酒泉市泉湖镇永久小学", "3011", "1148.8", "828.8", "144", "155", "0", "63", "0", "0", "1980", "45", "9", "36", "1300", "27.46", "5", "5"],
        ["11", "酒泉市实验小学", "4021", "2779", "801.8", "0", "0", "0", "0", "0", "0", "2800", "254", "60", "234", "22008", "38.7", "26", "25"],
        ["12", "酒泉市北关小学", "8252.6", "3649.2", "1186", "503.3", "601.8", "0", "301.8", "0", "0", "847.85", "266", "58", "265", "22267", "27.8", "26", "35"],
        ["13", "酒泉市红旗中心小学", "3856.6", "990.3", "1038.27", "204.65", "1594.3", "158.64", "0", "198.6", "0", "2395", "105", "30", "25", "5525", "63.2", "13", "12"],
        ["14", "酒泉市上坝中心小学", "9408", "3300", "31.70", "189", "5641", "364.6", "802", "635", "1147", "6595", "75", "45", "55", "15202", "94.25", "34", "19"],
        ["15", "酒泉市职教附小", "14320", "1481.3", "5182.9", "592.2", "1280.08", "0", "0", "0", "9450", "220", "89", "221", "4025", "362.38", "8", "51"],
        ["16", "酒泉市南苑小学", "4170", "4801", "928", "820", "146", "0", "0", "0", "0", "3866", "180", "23", "130", "23100", "302.36", "23", "23"],
        ["17", "酒泉市银达中心小学", "39204.9", "8204", "2136", "360", "3825", "1775", "841", "842", "3250", "2225", "126", "60", "120", "14800", "142.3", "26", "17"],
        ["18", "酒泉市康盛小学", "38206", "3300", "31.50", "225", "0", "0", "0", "0", "5000", "189", "28", "130", "22388", "326.18", "20", "20"],
        ["19", "酒泉市总寨中心小学", "47207", "5203", "2294", "732", "2265", "296", "270", "642", "5232", "1300", "100", "45", "25", "8000", "116", "20", "20"],
        ["20", "酒泉市东升中心小学", "12308", "696", "1833", "2104", "1394", "200", "300", "3000", "0", "3000", "100", "65", "25", "8000", "114", "20", "20"],
        ["21", "酒泉市丰乐中心小学", "18207", "4250", "1140", "2369", "1780", "267", "600", "1225", "2200", "65", "47", "25", "25", "8000", "148", "20", "15"],
        ["22", "酒泉市下河清中心小学", "23002", "5298", "891", "1223", "1328", "306", "288", "0", "5140", "76", "45", "31", "5258", "89.61", "17", "12"],
        ["23", "酒泉市三墩中心小学", "23003", "7949.71", "857.7", "2437", "1926", "306", "543", "1189.7", "3938", "86", "48", "30", "1655", "61.68", "15", "12"],
        ["24", "酒泉市三墩镇临水中心小学", "18677", "2216", "830", "673.3", "1271", "300", "339", "1384", "1283", "67", "38", "39", "4800", "66.4", "14", "13"],
        ["25", "酒泉市西大街小学", "20814", "1188", "9390", "940", "898", "0", "0", "970", "9629", "311", "79", "272", "8260", "103.828", "50", "22"],
        ["26", "酒泉市南关小学", "4029", "2280", "2240", "146", "290", "0", "2.40", "0", "0", "1529", "118", "61", "102", "15268", "56.98", "14", "14"],
        ["27", "酒泉市金塔镇中心小学", "9625.9", "3627.4", "3496", "1016.46", "2928", "321", "180", "65", "1189", "63", "45", "45", "8000", "58.5", "14", "8"],
        ["28", "玉门油田第二中学", "73194", "6954.62", "1598.42", "1393.4", "0", "581.5", "0", "259.79", "1025.4", "197", "97", "100", "30450", "205.72", "28", "22"],
        ["29", "酒泉第五中学", "73002", "3163", "10025", "1595", "1776", "688", "3164", "4581", "2208", "3095", "122", "138", "8211", "98.5", "57", "57"],
        ["30", "酒泉市北苑学校", "20000", "3052", "1200", "1200", "0", "0", "0", "200", "2529", "272", "34", "241", "6712", "83.2", "30", "65"],
        ["31", "酒泉市第七中学", "62028.62", "2278.2", "2280", "2280", "0", "520", "0", "849.2", "3369.67", "55", "35", "489", "8400", "98.3", "48", "48"],
        ["32", "酒泉市第八中学", "62204.4", "4408", "1650", "1944.5", "941.5", "0", "0", "0", "2987.69", "305", "65", "240", "6700", "77.8", "46", "46"],
        ["33", "酒泉博雅思双语学校", "37117", "5700.13", "900.52", "300", "258", "136", "7320", "0", "0", "0", "0", "0", "29000", "1390", "20", "20"],
        ["34", "酒泉市第一中学", "49171", "36689", "0767.78", "2006", "588", "0", "60", "0", "1648.22", "22544", "618", "203", "256", "71222", "303.8", "45", "45"],
        ["35", "酒泉市泉湖初级中学", "64067", "9467", "27.78", "2140", "4481.2", "2000", "620", "580", "0", "5237", "228", "46", "138", "2882", "311.4", "22", "21"],
        ["36", "酒泉市第六中学", "26384", "10773", "7258", "1148", "2298", "0", "360", "0", "0", "13348", "317", "106", "285", "63003", "676.6", "72", "48"],
        ["37", "酒泉市新苑学校", "34268", "12303", "1056.4", "1027", "1282", "0", "722", "0", "0", "22000", "806", "138", "338", "63003", "676.6", "72", "48"],
        ["38", "酒泉市体育中学", "29067", "3000", "316", "590", "224", "88", "1058", "30", "2700", "45", "15", "30", "3800", "44", "6", "6", "6"],
        ["39", "酒泉市第三中学", "27374", "23100.4", "992.66", "194.8", "2250.69", "198.3", "2298.4", "0", "0", "8058", "219", "119", "130", "32022", "210.8", "40", "40"],
        ["40", "酒泉市第二中学", "25305", "14881", "11982", "2200", "1024", "0", "990", "0", "0", "15800", "367", "236", "522", "51786", "672.38", "44", "44"],
        ["41", "酒泉市第四中学", "78776", "34346.6", "2278", "3249", "14694.62", "2868", "2488", "0", "2972.5", "459", "329", "280", "98622", "572.96", "82", "75"],
        ["42", "酒泉育才学校", "33877.6", "15308.36", "894.70", "2747.4", "2754.42", "1200", "2394.02", "1190", "4427", "1207.6", "220", "70", "1300", "236.5", "36", "30"],
        ["43", "酒泉市东苑学校", "23002", "8300", "7273", "360", "0", "653", "0", "0", "0", "3898", "120", "225", "57497", "93", "40", "40"],
        ["44", "玉门油田第一中学", "72298.59", "22022.1", "5927.6", "6023.7", "2618.3", "1158.1", "833", "0", "13808", "227", "117", "110", "32575", "150", "30", "38"],
        ["45", "酒泉博思达高级中学", "26969.1", "6120", "76", "1442", "5900", "120", "1322", "4.66", "8962", "260", "140", "1.10", "9300", "3320", "30", "27", "27"],
        ["46", "酒泉市实验中学", "18941.67", "9272.22", "619.42", "1221.89", "946.56", "642.9", "725.86", "672.86", "722.86", "620", "200", "63", "63", "63", "27", "27"],
        ["47", "酒泉市育才学校", "13007", "41266", "2244.4", "322", "1498", "470", "742", "3.452", "2200", "23095", "540", "303", "13002", "415", "186", "64", "64"],
        ["48", "酒泉市育才中学", "12308", "7241", "2504", "185", "3014", "2000", "100", "1110", "1186", "500", "98", "1.10", "13000", "170", "27", "27", "27"],
        ["49", "酒泉市树人中学", "23135", "34102.25", "9202.22", "1329", "1452", "1067.7", "795", "2890", "2922", "1400", "856", "228", "288", "70300", "602.097", "73", "73"],
        ["50", "酒泉市特殊教育学校", "19482", "6152", "21.22", "200", "1800", "394", "285", "0", "2790", "8330", "69", "41", "425", "8250", "86.06", "17", "17"]
      ],
      headers2: [
        "序号",
        "重点工作",
        "2023年",
        "2022年",
        "同比"
      ],
      tableData2: [
        ["1", "医保基金收支平稳", "全年基金53478万元，其中城乡居民医保资金收入29029万元，城镇职工医保基金收入24449万元。全年各项医保共计支出47201万元，其中城乡居民医保基金支出19865万元，城镇职工医保基金支出27336万元。", "全年基金收入48411万元，其中城乡居民医保基金收入27732万元，城镇职工医保基金收入20679万元。全年各项医保共计支出43005万元，其中城乡居民支出22689万元，城镇职工支出20316万元。", "医保基金支出增加7334万元，同比增长18%。基金运行基本平稳。"],
        ["2", "大病保险制度持续惠民", "全区落实大病保险及城镇职工补充医疗保险待遇累计22862人次，报销金额3678.9万元。", "全区落实大病保险及城镇职工补充医疗保险待遇累计22392人次，报销金额3596.94万元。", "享受大病保险人员同比增长470人次，报销金额增加81.96万元，同比增长2.28%。"],
        ["3", "医保改革有序推进", "实施DIP支付方式改革定点医疗机构31家，公立定点医疗机构DIP付费覆盖率达到100%，DIP实际付费8095.25万元。", "实施DIP支付方式改革定点医疗机构11家，公立定点医疗机构DIP付费覆盖率达到35.9%，DIP实际付费389.52万元。", "公立定点医疗机构DIP付费覆盖率增长64.5%，DIP付费金额增加7705.73万元。"],
        ["4", "职工门诊共济政策稳步实施", "截止12月底，完成职工普通门诊统筹报销79.9万人次2299.5万元。职工普通门诊医疗待遇进一步提升。", "-", "职工门诊共济政策落实实施、稳步推进，受益职工79.9万人次。报销金额2299.5万元。"],
        ["5", "经办服务时效不断提升", "梳理办理环节，压缩职工异地慢性病资格认定、异地慢性病手工报销等业务经办时限。将异地慢性病资格认定由每年集中开展一次调整为随时申报、随时受理，受理后15个工作日内完成资格认定；将异地慢性病手工报销业务由原来的每年集中受理一次调整为随时受理，受理后30个工作日内完成核算报销。2023年认定职工异地慢性病157人，核算报销异地慢性病及外购药人员医疗费40人次45.93万元。", "认定职工异地慢性病77人，核算报销异地慢性病及外购药人员医疗费34人29.72万元。", "职工异地慢性病资格认定、异地慢性病手工报销等业务经办时限不断压缩，职工异地慢性病享受人次增加106%，异地慢性病手工报销人次增长17.6%；异地慢性病及外购药报销金额增加16.21万元。"]
      ],
      headers3: [
        "序号",
        "类别",
        "重点工作完成情况"
      ],
      tableData3: [
        ["1", "人员编制", "肃州区疾病预防控制中心原有编制29人，2023年8月，肃州区疾病预防控制中心与肃州区卫生健康局综合监督执法所进行机构整合，合并后现有编制40人，实有在编在岗人员35人，其中专业技术人员26人，管理岗位1人，参照公务员管理人员8人。"],
        ["2", "传染病监测", "2023年度处理传染病预警信息共191起，其中麻疹1起，流行性腮腺炎75起，肺结核12起，其它感染性腹泻60起，新型冠状病毒感染20起，手足口病20起。严格落实新冠病毒感染病例“乙类乙管”政策，根据省、市、区相关要求开展新冠病毒感染病例监测，在传染病监测月分析的基础上，增加新冠病毒感染周监测，共完成周报44份。按照中国疾控中心要求，对辖区内医疗机构上报的新冠病毒感染重症病例77例、危重症病例37例，共计114例及时开展流行病学调查，填写个案调查表。每月对辖区内10所养老机构服务对象进行新冠核酸全覆盖检测，共完成养老机构工作人员和服务对象共744人次的检测，检测出阳性人员18人，及时向养老机构提出规范化处置建议，未发生聚集性疫情。按照国家和省、市相关要求，在东北街街道社区开展社区人群新冠监测工作，每周对监测人群进行新冠病毒核酸或抗原检测，同时对监测人群中临床症状、就医行为和住院情况等开展调查，用于评估人群感染水平，监测疫情变化趋势。第一阶段1月13日至7月30日建立不少于500户且不少于1500人的监测队列，截止7月30日，哨点人群已感染1322人。第二阶段7月31日起建立200人的监测队列，每周通过微信公众号收集相关信息，截止12月31日，哨点人群已感染178人，监测队列新冠病毒感染率为87.90%。"],
        ["3", "传染病防控", "开展传染病监测，分析发病趋势，重点关注学校、托幼机构、养老机构等重点场所的聚集性疫情。2023年2月中旬至4月底，我区流行性感冒病例明显增加，引发学校聚集性疫情5起，其中1起构成突发公共卫生事件（IV级一般事件），5起均按要求科学、及时、规范处置，未出现进一步扩散。12月11日，酒泉市人民医院上报1例鹦鹉热衣原体感染病例，因鹦鹉热衣原体感染病例为肃州区首次发现，按照相关要求，进行突发公共卫生事件网络直报，同时开展流行病学调查、密切接触者采样检测和主动搜索，未发现后续病例发生。"],
        ["4", "鼠疫防控", "1. 2023年根据酒泉市鼠疫宣传周活动方案要求，4月17日至4月23日，肃州区各防成员单位、医疗卫生机构扎实开展了以“坚持预防为主，消除鼠疫危害”为主题的第九个鼠疫防控宣传周活动。活动周期间各单位组织鼠防知识“五进”活动，持续开展广泛宣传活动，合计开展宣传50余场次，发放宣传资料10万余份。2. 鼠防检疫站检疫工作运行正常：全区七处检疫卡自4月1日上卡，严格落实24小时检疫值守制度，做到凡出必检，不漏一人，同时对进出人员进行鼠疫防治知识宣传。全区7个检疫站共登记进出山人员12149人，车辆6889辆，劝退2037人，车辆637辆（较上年同期有所上升），充分发挥了检疫站“前哨”作用。3. 严格要求医务人员全员培训，组织医务人员参加全市鼠疫防治网络课程集中培训，增强全体医务人员的防治水平，在敦煌文博会鼠疫保障期间组织全体医务人员参与市级考试，以考促培；后组织全体医务人员参与鼠疫防控知识考评活动，全体医务人员防控知识掌握率达到90%以上。4. 持续开展保护性灭獭工作：根据《酒泉市2023年保护性灭獭灭蚤技术指导方案》要求，先后在清水镇、丰乐镇、金塔县等有鼠疫疫源地的乡镇持续开展了保护性灭獭灭蚤工作，2023年共填埋有鼠活动洞穴391个，无鼠活动洞穴24个，投放毒饵45公斤，保护性灭獭灭蚤面积40平方公里，累计参与人数55人次，出动车辆12次，灭獭效果达到酒泉市评估水平要求。5. 10月份市、区两级在金佛寺镇红寺坡举行了一次应急演练，市、区疾控中心、南山六家乡镇卫生院共计70余人参与了演练，提高了我区卫生应急处置能力。"],
        ["5", "艾滋病防控", "1. 检测方面：2023年新增艾滋病检测点15个，共有艾滋病确证实验室1个，艾滋病初筛实验室9个，检测点34个。2023年共检测全人群137978人次，较上年度检测率上升33.2%。3家VCT门诊检测咨询3032人，完成率101.5%（3032/2889）。2. 宣传教育方面：高危人群宣传教育达1358人次，其中男男同性恋人群2571人次，暗娼人群3202人次，干预覆盖率100%。开展线上线下宣传培训15场次，通过宣传教育活动，艾滋病防治知识知晓率流动人口为94%，吸毒人群为96.8%，男男性行为人群为99%，性工作者为98.2%。对辖区18所初高中、2所职业中专、1所职业中学，采用线上线下相结合的方式进行防艾禁毒专题巡回讲座，共覆盖学生一万余人。对驻酒部队开展艾滋病防治知识进军营宣讲活动，共覆盖官兵达1300余人。3. 抗病毒治疗方面：患者/感染者正在接受治疗185人，治疗率达到95.4%（185/194）；抗病毒治疗成功率达到98.2%（161/164）；2023年新报告HIV/AIDS，确诊后30天内自动自愿治疗率均为100%（17/17）；HIV感染者/艾滋病患者规范随访CD4检测率100%（194/194），病毒载量检测率99.48%（190/191），配偶固定性伴侣HIV检测比例100%（41/41）。"]
      ],
      list: [{value: 1, label: 'cs'}]
    }
  },
  watch: {},
  methods: {
    //选择拿值
    changeSelect(e) {
      console.log(e)
    },
    async initChart(id) {
      if (!this.charts[id]) {
        this.charts[id] = this.$echarts.init(document.getElementById(id));
        this.charts[id].showLoading({
          text: '加载中',
          textColor: '#fff',
          maskColor: 'rgba(0,0,0,0)'
        })
        if(id==='societyMap'){
          this.charts[id].on('mouseover',(e)=>{
            this.cityName = e.componentType === 'markPoint' ? e.data.cityName : e.name;
            let list=[
              {
                "tow": "西峰镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 52,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 58,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 40,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 14356,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 23,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 107,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "果园镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 94,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 100,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 94,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 48942,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 10,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 35,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "银达镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 112,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 114,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 68,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 45488,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 20,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 73,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "泉湖镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 85,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 93,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 60,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 42944,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 13,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 47,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "铧尖镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 115,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 118,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 80,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 45070,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 7,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 29,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "三墩镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 197,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 197,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 182,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 80006,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 18,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 69,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "黄泥堡乡",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 18,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 18,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 29,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 10204,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 2,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 10,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "西洞镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 65,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 65,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 42,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 22633,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 6,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 26,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "总寨镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 101,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 104,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 100,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 50518,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 13,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 52,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "上坝镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 144,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 154,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 110,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 79204,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 15,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 48,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "东洞镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 96,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 102,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 39,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 61149,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 9,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 33,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "金佛寺镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 175,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 184,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 145,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 88137,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 16,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 64,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "丰乐镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 66,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 68,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 63,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 31902,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 6,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 25,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "清水镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 160,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 167,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 126,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 72081,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 18,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 70,
                    "unit": "人"
                  }
                ]
              },
              {
                "tow": "下河清镇",
                "data": [
                  {
                    "name": "结队干部",
                    "value": 50,
                    "unit": "人"
                  },
                  {
                    "name": "关爱对象",
                    "value": 57,
                    "unit": "人"
                  },
                  {
                    "name": "帮办实事",
                    "value": 28,
                    "unit": "件"
                  },
                  {
                    "name": "资助资金",
                    "value": 23806,
                    "unit": "元"
                  },
                  {
                    "name": "卫生机构",
                    "value": 8,
                    "unit": "个"
                  },
                  {
                    "name": "卫生技术人员",
                    "value": 68,
                    "unit": "人"
                  }
                ]
              }
            ]
            this.toolList=list.filter(item => item.tow.includes(this.cityName)).map(item => item.data)[0]
            this.tooltipShow=true
          });
          this.charts[id].on('mouseout', () => {
            this.tooltipShow = false;
          });
        }
      }
      let option = await this[id + 'Option']();
      this.charts[id].setOption(option);
      this.charts[id].hideLoading();
    },
    async societyMapOption() {
      let dataList = [ {
        cityName:'西峰镇',
        "coord": [
          "98.476123",//西峰
          "39.733162"
        ]
      },{
        cityName:'总寨镇',
        "coord": [
          "98.669292",
          "39.656433"
        ]
      },{
        cityName:'银达镇',
        "coord": [
          "98.571037",
          "39.803381"
        ]
      },{
        cityName:'三墩镇',
        "coord": [
          "98.731518",
          "39.788872"
        ]
      },{
        cityName:'铧尖镇',
        "coord": [
          "98.657341",//铧尖
          "39.717085"
        ]
      },{
        cityName:'上坝镇',
        "coord": [
          "98.712407",//上坝
          "39.612822"
        ]
      },
        {
          cityName:'下河清',
          "coord": [
            "98.980462",//下河清
            "39.560477"
          ]
        },
        {
          cityName:'东洞镇',
          "coord": [
            "98.63409",//东洞镇
            "39.551714"
          ]
        },{
          cityName:'西洞镇',
          "coord": [
            "98.459281",//西洞镇
            "39.65431"
          ]
        },
        {
          cityName:'黄泥堡乡',
          "coord": [
            "98.834582",//黄泥堡乡
            "39.71755"
          ]
        },
        {
          cityName:'金佛寺镇',
          "coord": [
            "98.780061",//金佛寺镇
            "39.425904"
          ]
        }, {
          cityName:'丰乐镇',
          "coord": [
            "98.897147",//丰乐镇
            "39.389238"
          ]
        }, {
          cityName:'清水镇',
          "coord": [
            "99.065828",//清水镇
            "39.365553"
          ]
        },
        {
          cityName:'果园镇',
          "coord": [
            "98.486738",//果园镇
            "39.786748"
          ]
        },
      ];
      let electricPileIcon = await staticImageToBase64(require('@/assets/images/theme-blue/runing.png'));
      let geoCoordMap = {};
      const geoJson = require('@/assets/geo/suzhouqu.json');
      this.$echarts.registerMap('szq', {geoJSON: geoJson});
      geoJson.features.forEach(function (v) {
        var name = v.properties.name;
        // 地区经纬度
        geoCoordMap[name] = v.properties.centroid;
      });
      let size = '40%';
      let roam = false;
      let zoom = 3;
      return {
        geo: [{
          animationDuration: 0,
          animationDurationUpdate: 0,
          layoutCenter: ['50%', '55%'],//位置
          layoutSize: size,//大小
          show: true,
          map: 'szq',
          roam,
          zoom,
          aspectScale: 1,
          label: {
            normal: {
              show: false,
              textStyle: {
                color: '#fff',
                fontSize: 14
              }
            },
            emphasis: {
              show: true,
              textStyle: {
                color: '#fff'
              }
            }
          },
          select: {
            label: {
              color: '#fff'
            },
            itemStyle: {
              areaColor: {
                type: "linear",
                x: 6000,
                y: 0,
                x2: 0,
                y2: 0,
                colorStops: [{
                  offset: 0,
                  color: "rgba(3,27,78,0.75)", // 0% 处的颜色
                }, {
                  offset: 1,
                  color: "rgba(58,149,253,0.75)", // 50% 处的颜色
                },],
                global: true, // 缺省为 false
              },
              borderColor: "#c0f3fb",
              borderWidth: 1,
              shadowColor: "#8cd3ef",
              shadowOffsetY: 10,
              shadowBlur: 120,
            }
          },
          emphasis: {
            label: {
              color: '#fff'
            },
            itemStyle: {
              areaColor: {
                type: "linear",
                x: 6000,
                y: 0,
                x2: 0,
                y2: 0,
                colorStops: [{
                  offset: 0,
                  color: "rgba(3,27,78,0.75)", // 0% 处的颜色
                }, {
                  offset: 1,
                  color: "rgba(58,149,253,0.75)", // 50% 处的颜色
                },],
                global: true, // 缺省为 false
              },
              borderColor: "#c0f3fb",
              borderWidth: 1,
              shadowColor: "#8cd3ef",
              shadowOffsetY: 10,
              shadowBlur: 120,
            }
          },
          itemStyle: {
            normal: {
              areaColor: {
                type: "linear",
                x: 6000,
                y: 0,
                x2: 0,
                y2: 0,
                colorStops: [{
                  offset: 0,
                  color: "rgba(3,27,78,0.75)", // 0% 处的颜色
                }, {
                  offset: 1,
                  color: "rgba(58,149,253,0.75)", // 50% 处的颜色
                },],
                global: true, // 缺省为 false
              },
              borderColor: "#c0f3fb",
              borderWidth: 1,
              shadowColor: "#8cd3ef",
              shadowOffsetY: 10,
              shadowBlur: 120,
            },
          }
        }, {
          animationDuration: 0,
          animationDurationUpdate: 0,
          type: "map",
          map: 'szq',
          zlevel: -1,
          aspectScale: 1,
          zoom,
          layoutCenter: ["50%", "56%"],
          layoutSize: size,
          roam,
          silent: true,
          itemStyle: {
            normal: {
              borderWidth: 1,
              // borderColor:"rgba(17, 149, 216,0.6)",
              borderColor: "rgba(58,149,253,0.8)",
              shadowColor: "rgba(172, 122, 255,0.5)",
              shadowOffsetY: 5,
              shadowBlur: 15,
              areaColor: "rgba(5,21,35,0.1)",
            },
          },
        }, {
          animationDuration: 0,
          animationDurationUpdate: 0,
          type: "map",
          map: 'szq',
          zlevel: -2,
          aspectScale: 1,
          zoom,
          layoutCenter: ["50%", "57%"],
          layoutSize: size,
          roam,
          silent: true,
          itemStyle: {
            normal: {
              borderWidth: 1,
              // borderColor: "rgba(57, 132, 188,0.4)",
              borderColor: "rgba(58,149,253,0.6)",
              shadowColor: "rgba(65, 214, 255,1)",
              shadowOffsetY: 5,
              shadowBlur: 15,
              areaColor: "transpercent",
            },
          },
        }, {
          animationDuration: 0,
          animationDurationUpdate: 0,
          type: "map",
          map: 'szq',
          zlevel: -3,
          aspectScale: 1,
          zoom,
          layoutCenter: ["50%", "58%"],
          layoutSize: size,
          roam,
          silent: true,
          itemStyle: {
            normal: {
              borderWidth: 1,
              // borderColor: "rgba(11, 43, 97,0.8)",
              borderColor: "rgba(58,149,253,0.4)",
              shadowColor: "rgba(58,149,253,1)",
              shadowOffsetY: 15,
              shadowBlur: 10,
              areaColor: "transpercent",
            },
          },
        }, {
          animationDuration: 0,
          animationDurationUpdate: 0,
          type: "map",
          map: 'szq',
          zlevel: -4,
          aspectScale: 1,
          zoom,
          layoutCenter: ["50%", "59%"],
          layoutSize: size,
          roam,
          silent: true,
          itemStyle: {
            normal: {
              borderWidth: 5,
              // borderColor: "rgba(11, 43, 97,0.8)",
              borderColor: "rgba(5,9,57,0.8)",
              shadowColor: "rgba(29, 111, 165,0.8)",
              shadowOffsetY: 15,
              shadowBlur: 10,
              areaColor: "rgba(5,21,35,0.1)",
            },
          },
        },],
        series: [
          {
            animationDuration: 0,
            animationDurationUpdate: 0,
            type: 'map',
            map: 'szq',
            geoIndex: 0,
            aspectScale: 1,//长宽比
            zoom,
            showLegendSymbol: true,
            roam,
            markPoint: {
              symbol: 'image://' + electricPileIcon,
              symbolSize: [26,26],
              data: dataList,
            },
          },
        ],
      };
    },
  },
  beforeDestroy() {
    Object.keys(this.charts).forEach(item => {
      this.charts[item] && this.charts[item].dispose();
      this.charts[item] = null;
    })
  },
  async mounted() {
    Object.keys(this.charts).forEach(item => {
      this.initChart(item);
    });
  }
}
</script>
<style lang="scss" scoped>
.overall-page {
  position: relative;
  padding: 90px 20px 20px 20px;

  .overall-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
    position: relative;
    z-index: 9;
  }

  .cusHeight {
    height: 260px;
  }

  .top-container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .top-item {
      width: calc(29% - 10px);
    }

    .top-item1 {
      width: 42%;
      height: 550px;
      .map-tooltip {
        position: absolute;
        z-index: 9;
        background: #fff;
        width: 450px;
        height: 250px;
        right: 29%;
        bottom: 35%;
        background: url("~@/assets/images/theme-blue/common/monitoring-over-modal.png") no-repeat center;
        background-size: 100% 100%;

        .map-tooltip-title {
          display: flex;
          align-items: center;
          color: #29F1FA;
          font-family: fzhzgbjianti;
          font-size: 24px;
          padding-left: 20px;
          height: 60px;
        }

        .map-tooltip-content {
          width: 95%;
          margin: 0 auto;
          height: calc(100% - 85px);
          display: flex;
          justify-content: space-between;
          flex-wrap: wrap;

          .tooltip-item {
            width: calc(100% / 3 - 10px);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;

            .value {
              display: flex;
              align-items: flex-end;
              margin-bottom: 10px;

              .number {
                font-weight: bold;
                font-size: 24px;
                color: #FFCB00;
              }

              .unit {
                color: #29F1FA;
                font-size: 13px;
              }
            }

            .label {
              color: #29F1FA;
            }
          }
        }
      }
    }

  }

  .info-block {
    width: 100%;

    .info-container {
      width: 100%;
      display: flex;
      align-items: center;
      margin-top: 15px;

      .info-item:nth-child(3n) {
        margin-right: 0;
      }

      .info-item {
        width: calc((100% - 30px) / 3);
        margin-right: 15px;
      }
    }
  }
}

</style>
